<!DOCTYPE html>

<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
  <head>
    <title>hyw有限公司</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- <link rel="stylesheet" href="css/bootstrap.min.css"> -->
    <link rel="stylesheet" href="css/animate.css">
    <link rel="stylesheet" href="css/flexslider.css">
    <link rel="stylesheet" href="fonts/icomoon/style.css">
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/style.css">
    <link href="new/fonts.css" rel="stylesheet">
    <!--vue-->
    <script src="/js/vue.js"></script>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="/css/index.css">
    <!-- 引入组件库 -->
    <script src="/js/index.js"></script>
    <!--axios-->
    <script src="/js/axios.min.js"></script>
  </head>
  <style>
    .el-dropdown {
      vertical-align: top;
    }
    .el-dropdown + .el-dropdown {
      margin-left: 15px;
    }
    .el-icon-arrow-down {
      font-size: 12px;
    }
    .nav-item{

    }
  </style>
  <body data-spy="scroll" data-target="#pb-navbar" data-offset="200">
  <!--app-->
  <div id="app">
    <!--登录模态框-->
    <el-dialog title="登录" :visible.sync="dialogVisible" width="30%">
      <el-form ref="user" :rules="rules" :model="user" label-width="80px">
        <el-form-item label="账号" prop="userid">
          <el-input v-model="user.userid"></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="password">
          <el-input type="password" v-model="user.password"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="login()">登 录</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!--nav-->
    <nav class="navbar navbar-expand-lg site-navbar navbar-light bg-light" id="pb-navbar">
      <div class="container">
        <!--<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample09" aria-controls="navbarsExample09" aria-expanded="false" aria-label="Toggle navigation">-->
        <!--<span class="navbar-toggler-icon">???</span>-->
        <!--</button>-->
        <span class="navbar-brand">hyw</span>
        <div class="collapse navbar-collapse justify-content-md-center" id="navbarsExample09">
          <ul class="navbar-nav">
            <li class="nav-item"><a class="nav-link" href="index.html" style="font-size: 20px">首页</a></li>
            <li class="nav-item" v-if="isBack"><a class="nav-link" href="/html/index.html" style="font-size: 20px">后台</a></li>
            <li class="nav-item" v-if="isElse"><el-button type="primary" style="font-size: 20px;color: white;" @click="toRecruit()">加入我们</el-button></li>
            <li class="nav-item" v-if="isShow">
              <el-dropdown>
                <el-button type="primary" style="font-size: 20px;color: white;">
                  个人办理<i class="el-icon-arrow-down el-icon--right"></i>
                </el-button>
                <el-dropdown-menu slot="dropdown" style="background-color: dodgerblue">
                  <el-dropdown-item><el-button type="primary" style="width: 100%;font-size: 20px;color: white;" @click="toLeave()">请假</el-button></el-dropdown-item>
                  <el-dropdown-item><el-button type="primary" style="width: 100%;font-size: 20px;color: white;" @click="toPro()">晋升申请</el-button></el-dropdown-item>
                  <!--<el-dropdown-item><el-button type="primary" style="width: 100%;font-size: 20px;color: white;" @click="toDor()">宿舍报修</el-button></el-dropdown-item>-->
                  <!--<el-dropdown-item><el-button type="primary" style="width: 100%;font-size: 20px;color: white;" @click="toSal()">个人薪资</el-button></el-dropdown-item>-->
                  <!--<el-dropdown-item><el-button type="primary" style="width: 100%;font-size: 20px;color: white;" @click="toEmail()">个人邮箱</el-button></el-dropdown-item>-->
                  <!--<el-dropdown-item><el-button type="primary" style="width: 100%;font-size: 20px;color: white;" @click="toDisk()">个人云盘</el-button></el-dropdown-item>-->
                  <el-dropdown-item><el-button type="primary" style="width: 100%;font-size: 20px;color: white;" @click="toQuit()">离职</el-button></el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
            </li>
            <li class="nav-item" v-if="isShow"><el-button type="primary" style="font-size: 20px;color: white;" @click="sign()">打卡</el-button></li>
            <li class="nav-item" v-if="isShow"><el-button type="primary" style="font-size: 20px;color: white;" @click="toTrain()">培训视频</el-button></li>
            <li class="nav-item" v-if="isShow"><el-button type="primary" style="font-size: 20px;color: white;" @click="toCar()">车联使用中心</el-button></li>
            <li class="nav-item">
              <el-button type="primary" v-if="isElse" style="font-size: 20px" @click="toLogin()">先 登 录</el-button>
              <el-menu
                      :default-active="activeIndex2"
                      class="el-menu-demo"
                      mode="horizontal"
                      @select="handleSelect"
                      background-color="#001529"
                      text-color="#fff"
                      active-text-color="#ffd04b"
                      v-if="isShow">
                <el-submenu index="2">
                  <template slot="title">欢迎 {{user.username}}</template>
                  <el-menu-item index="2-3" @click="exitLogin()">注销</el-menu-item>
                </el-submenu>
              </el-menu>
            </li>
          </ul>
        </div>
      </div>
    </nav>

    <!--banner-->
    <section class="site-hero" style="background-image: url(images/banner2.jpg);" id="section-home" data-stellar-background-ratio="0.5">
      <div class="container">
        <div class="row intro-text align-items-center justify-content-center">
          <div class="col-md-10 text-center">
            <h1 class="site-heading site-animate">优秀的运营管理<strong>团队</strong></h1>
          </div>
        </div>
      </div>
    </section>

    <!--主页面main-->
    <section id="A1">
      <!--iframe嵌入式框架 scrolling滚动条-->
      <iframe name="myFrameName" frameborder="0" width="100%" height="900px" marginheight="0" marginwidth="0"
                :src="url">
      </iframe>
    </section>

    <!--footer 联系图标 版权-->
    <footer class="site-footer">
      <div class="container">
        <div class="row mb-3">
          <div class="col-md-12 text-center">
            <p>
              <a href="#" class="social-item"><span class="icon-facebook2"></span></a>
              <a href="#" class="social-item"><span class="icon-twitter"></span></a>
              <a href="#" class="social-item"><span class="icon-instagram2"></span></a>
              <a href="#" class="social-item"><span class="icon-linkedin2"></span></a>
              <a href="#" class="social-item"><span class="icon-vimeo"></span></a>
            </p>
          </div>
        </div>
        <div class="row">
          <p class="col-12 text-center">
            Copyright &copy; 2018 - <script>document.write(new Date().getFullYear());</script> hyw.All rights reserved.
          </p>
        </div>
      </div>
    </footer>
  </div>
  <!--app-->
  <script>
    var app = new Vue({
      el:"#app",
      data:{
        user:{userid:'',password:''},//用户
        isShow:false,//是否显示登录后的模块，先隐藏
        isElse:true,//是否显示登录前的登录按钮，先显示
        isBack:false,//是否显示后台，先隐藏
        url:null,//跳转路径
        dialogVisible: false,
          rules: {
              userid: [
                  { required: true, message: '请输入账号', trigger: 'blur' },
                  { min: 5, max: 15, message: '长度在 5 到 15 个字符', trigger: 'blur' }
              ],
              password: [
                  { required: true, message: '请输入密码', trigger: 'blur' },
                  { min: 5, max: 15, message: '长度在 5 到 15 个字符', trigger: 'blur' }
              ]
          }
      },
      //初始化
      created:function(){
        this.loadData();//就是这样写！！！
      },
      methods:{
        loadData:function(){//初始化新闻
          axios.post('/jump/toNew').then(function (response) {
            app.url=response.data.jumpPath;
          })
        },
        toLogin:function () {//打开登录模态框
          app.user.userid='';
          app.user.password='';
          app.dialogVisible = true;
        },
        login:function () {//点击登录按钮
          if(app.user.userid==''||app.user.password==''){
            app.$message.error("用户名和密码不能为空！");
            return;
          }
          var check=/^[0-9]*$/;
          if (check.test(app.user.userid)){//判断是否都是数字，如果是就是登录users表
            axios.post('/user/login2',app.user).then(function (response) {
              if (response.data.code==2002){
                //提示失败
                app.$message.error(response.data.info);
                app.user.userid='';
                app.user.password='';
              }else{
                //提示成功
                app.$message({
                  message: response.data.info,
                  type: 'success'
                });
                app.user=response.data.dataBack;//获取当前用户信息
                if (app.user!=null||app.user!=''){
                  app.isElse=false;
                  app.isShow=true;//显示登录后的模块
                  app.dialogVisible = false;
                }
                app.loadData();
              }
            })
            //console.log("都是数字");
          }else {//如果不都是数字，就是登录sys_user表
            axios.post('/user/login?userName='+app.user.userid+"&passWord="+app.user.password).then(function (response) {
              if(response.status == 200){
                if(response.data>0) {
                  //location.href="/html/index.html";
                  //查询当前用户信息
                  axios.post('/user/userOne?userid='+app.user.userid).then(function (response) {
                    app.user=response.data.list;
                  })
                  app.isBack=true;
                  app.isElse=false;
                  app.isShow=true;//显示登录后的模块
                  app.dialogVisible = false;
                }else{
                  _this.$message.error("用户名或者密码错误");
                }
              }
            })
            //console.log("都是字母");
          }
        },
        exitLogin:function(){
          window.location.href='index.html'//刷新页面
        },
        aboutMe:function(){//点击关于我们
        },
        toRecruit:function () {//点击加入我们
          axios.post('/jump/toRecruit').then(function (response) {
            app.url=response.data.jumpPath;
          })
          document.getElementById('A1').scrollIntoView({
            block: 'start',
            inline: 'nearest',
            behavior: 'smooth'
          })
        },
        toLeave:function () {//点击请假
          axios.post('/jump/toLeave').then(function (response) {
            app.url=response.data.jumpPath;
          })
          document.getElementById('A1').scrollIntoView({
            block: 'start',
            inline: 'nearest',
            behavior: 'smooth'
          })
        },
        toPro:function () {//点击晋升
          axios.post('/jump/toPro').then(function (response) {
            app.url=response.data.jumpPath;
          })
          document.getElementById('A1').scrollIntoView({
            block: 'start',
            inline: 'nearest',
            behavior: 'smooth'
          })
        },
        toDor:function () {//点击宿舍报修
          axios.post('/jump/toDor').then(function (response) {
            app.url=response.data.jumpPath;
          })
          document.getElementById('A1').scrollIntoView({
            block: 'start',
            inline: 'nearest',
            behavior: 'smooth'
          })
        },
        toSal:function () {//点击个人薪资
          axios.post('/jump/toSal').then(function (response) {
            app.url=response.data.jumpPath;
          })
          document.getElementById('A1').scrollIntoView({
            block: 'start',
            inline: 'nearest',
            behavior: 'smooth'
          })
        },
        toEmail:function () {//点击邮箱

        },
        toDisk:function () {//点击云盘

        },
        toQuit:function () {//点击辞职
          axios.post('/jump/toQuit').then(function (response) {
            app.url=response.data.jumpPath;
          })
          document.getElementById('A1').scrollIntoView({
            block: 'start',
            inline: 'nearest',
            behavior: 'smooth'
          })
        },
        sign:function () {//打卡

        },
        toTrain:function () {//点击培训视频
          axios.post('/jump/toTrain').then(function (response) {
            app.url=response.data.jumpPath;
          })
          document.getElementById('A1').scrollIntoView({
            block: 'start',
            inline: 'nearest',
            behavior: 'smooth'
          })
        },
        toCar:function () {//点击车辆使用中心
          axios.post('/jump/toCar').then(function (response) {
            app.url=response.data.jumpPath;
          })
          document.getElementById('A1').scrollIntoView({
            block: 'start',
            inline: 'nearest',
            behavior: 'smooth'
          })
        }
      }
    });
  </script>

    <script src="js/vendor/jquery.min.js"></script>
    <script src="js/vendor/popper.min.js"></script>
    <script src="js/vendor/bootstrap.min.js"></script>
    
    <script src="js/vendor/jquery.easing.1.3.js"></script>
    <script src="js/vendor/jquery.stellar.min.js"></script>
    <script src="js/vendor/jquery.waypoints.min.js"></script>

    <!--<script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.min.js"></script>-->
    <!--<script src="https://unpkg.com/imagesloaded@4/imagesloaded.pkgd.min.js"></script>-->
    <script src="js/custom.js"></script>

    <!-- Google Map -->
    <!--<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBVWaKrjvy3MaE7SQ74_uJiULgl1JY0H2s&sensor=false"></script>-->
    <script src="js/google-map.js"></script>
  </body>
</html>